<template>
    <div id="base">
        <Map></Map>
        <div class="breadcrumb">
            <el-breadcrumb separator-class="el-icon-arrow-right">
                <el-breadcrumb-item>您的位置</el-breadcrumb-item>
                <el-breadcrumb-item>|首页</el-breadcrumb-item>
                <el-breadcrumb-item>基地</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="container-content">
            <TabContol/>
        </div>
        <div class="container-content">
            <BaseInfoList/>
        </div>

        <div class="container-content">
            <Pagination/>
        </div>

    </div>
</template>
<!--基地-->
<script>
    import TabContol from "../../component/tabControl/TabContol";
    import BaseInfoList from "./childComponents/baseInfoList/BaseInfoList";
    import {Breadcrumb, BreadcrumbItem} from "element-ui";
    import Pagination from "@/component/pagination/Pagination";
    import Map from "../../component/map/Map";
    export default {
        name: "Base",
        components: {
            TabContol,
            BaseInfoList,
            Pagination,
            Map,
            "el-breadcrumb": Breadcrumb,
            "el-breadcrumb-item": BreadcrumbItem
        }
    }
</script>

<style scoped>
    .breadcrumb{
        margin-top: 10px;
        margin-bottom: 20px;
        margin-left: 60px;
    }
    .container-content {
        display: flex;
        justify-content: space-evenly;
    }
</style>
